// import {computed,makeAutoObservable} from 'mobx'

// class TaskStore{
//     constructor(){
//         makeAutoObservable(this,{
//             isAll:computed
//         })
//     }
//     list=[{
//         id:1,
//         name:'have dinner',
//         isDone:false
//     },
//     {
//         id:2,
//         name:'have dinner',
//         isDone:false
//     },
//     {
//         id:3,
//         name:'have dinner',
//         isDone:true
//     }]

//     checkItem(id){
//         const item=this.list.find(item=>item.id==id);
//         item.isDone=!item.isDone;
//     }
//     deleteItem(id){
//         this.list=this.list.filter(item=>item.id!==id)
//     }
//     allChange(checked){
//         this.list.forEach(item=>{
//             item.isDone=checked
//         })
//     }
//     get isAll(){
//         return this.list.every(item=>item.isDone)
//     }
//     addItem(item){
//         this.list.push(item)
//     }
// }
// export default TaskStore

import { makeAutoObservable, computed } from 'mobx'

class TaskStore {
  list = [
    {
      id: 1,
      name: '学习react',
      isDone: false
    },
    {
      id: 2,
      name: '学习vue',
      isDone: true
    }
  ]

  constructor () {
    makeAutoObservable(this, {
      isAll: computed,
      totalTask:computed,
      completedTask:computed,
      activedTask:computed
    })
  }

  checkItem (id) {
    const item = this.list.find(item => item.id === id)
    item.isDone = !item.isDone
  }

  delItem(id) {
    this.list = this.list.filter(item => item.id !== id)
  }

  allCheckItem (checked) {
    this.list.forEach(item => {
      item.isDone = checked
    })
  }

  get isAll () {
    return this.list.every(item => item.isDone)
  }

  get totalTask () {
    return this.list.length
  }

  get completedTask(){
    let newList = this.list.filter(item=>item.isDone==true)
    return newList.length
  }

  addItem(item) {
    this.list.push(item)
  }

}

export default TaskStore